/*
  学习目标：useEffect-第二个参数，模拟生命周期
  1. 需求：模拟挂载时
  2. 需求：模拟更新时
*/

import React, { useEffect } from 'react';
import { useState } from 'react';

export default function App() {
  const [count, setCount] = useState(99);

  // 1. 模拟挂载时
  // 语法： useEffect(() =>{} , [])
  useEffect(() => {
    console.log(count, 'count');
    // document.title = count;
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

  // 2. 模拟更新时
  // 语法： useEffect(() => {}, [依赖项])
  // 等同于：💥挂载、更新二合一
  // 类似： vue中的watch开启了immediately
  useEffect(() => {
    console.log('我要执行了', count);
    // document.title = count;
  }, [count]);

  return (
    <div>
      <h1>{count}</h1>
      <button onClick={() => setCount(count + 1)}>点我+1</button>
    </div>
  );
}
